<%@ page contentType="text/html; charset=UTF-8"%>
<%@ taglib prefix="s" uri="/struts-tags"%>
<%
	if (session.getAttribute("connecte") == null
			|| !((String) session.getAttribute("connecte"))
					.equals("true")) {
		String redirectURL = "/AnalyseurSite/template/loginadm";
		response.sendRedirect(redirectURL);
	}
%>
<!DOCTYPE html>
<!--[if lt IE 7]>      <html class="no-js lt-ie9 lt-ie8 lt-ie7"> <![endif]-->
<!--[if IE 7]>         <html class="no-js lt-ie9 lt-ie8"> <![endif]-->
<!--[if IE 8]>         <html class="no-js lt-ie9"> <![endif]-->
<!--[if gt IE 8]><!-->
<html class="no-js" lang="en">
<!--<![endif]-->

<head>
<meta charset="utf-8">
<title>Analyseur Web - M2 MIAGE 2013</title>

<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="apple-mobile-web-app-capable" content="yes" />
<meta name="description" content="">
<meta name="author" content="">

<!-- ===================== Touch Icons ===================== -->
<link rel="shortcut icon" href="favicon.ico">
<link rel="apple-touch-icon-precomposed" sizes="144x144"
	href="apple-touch-icon-144-precomposed.png">
<link rel="apple-touch-icon-precomposed" sizes="114x114"
	href="apple-touch-icon-114-precomposed.png">
<link rel="apple-touch-icon-precomposed" sizes="72x72"
	href="apple-touch-icon-72-precomposed.png">
<link rel="apple-touch-icon-precomposed"
	href="apple-touch-icon-57-precomposed.png">

<!-- ===================== CSS ===================== -->
<link href='http://fonts.googleapis.com/css?family=Open+Sans'
	rel='stylesheet' type='text/css'>
<link rel="stylesheet" href="css/bootstrap/bootstrap.min.css">
<link rel="stylesheet" href="css/bootstrap/bootstrap-responsive.min.css">

<!-- Site specific - CSS -->
<link rel="stylesheet" href="css/theme_light/prettify.css">
<link rel="stylesheet" href="css/theme_light/tables/dataTables.css">
<link rel='stylesheet' href='css/theme_light/calendar/fullcalendar.css' />
<link rel='stylesheet'
	href='css/theme_light/calendar/fullcalendar.print.css' media='print' />
<link rel="stylesheet" href="css/theme_light/formselements/chosen.css">
<link rel="stylesheet" href="css/theme_light/formselements/dropkick.css">
<link rel="stylesheet"
	href="css/theme_light/jquery-ui-1.8.20.custom.css">

<!-- Common - CSS -->
<link rel="stylesheet" href="css/theme_light/common.css">
<link rel="stylesheet" href="css/theme_light.css" class="style_set">

<!--[if lt IE 9]>
      <script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
    <![endif]-->
<!-- ===================== JS ===================== -->
<script src="js/libs/jquery-1.7.2.min.js"></script>
<script type="text/javascript">
	function ChargerMenu() {
		var jContent = $("#menuAnalyseur");
		ChargerPage(1);
		$.ajax({
			// The link we are accessing.
			url : "/AnalyseurSite/template/Menuadmin",

			// The type of request.
			type : "get",

			// The type of data that is getting returned.
			dataType : "html",

			error : function() {
				ShowStatus("AJAX - error()");

				// Load the content in to the page.
				jContent.html("<p>Page Not Found!!</p>");
			},

			beforeSend : function() {
				ShowStatus("AJAX - beforeSend()");
			},

			complete : function() {
				jContent.html();
			},

			success : function(strData) {
				// Load the content in to the page.
				jContent.html(strData);
			}
		});
		//charger le premier produit
		//TabSelectionner(${numProd});
	}
</script>
<script src="js/libs/bootstrap.min.js"></script>
<script src="js/libs/ios-orientationchange-fix.js"></script>
<script src="js/libs/jquery-ui-1.8.20.custom.min.js"></script>
<script src="js/plugins/widgets/jquery.sparkline.min.js"></script>
<script src="js/common.js"></script>

<!-- Site specific -->
<script src="js/libs/prettify.js"></script>
<script src="js/plugins/charts/jquery.flot.min.js"></script>
<script src="js/plugins/charts/jquery.flot.resize.min.js"></script>
<script src="js/plugins/charts/jquery.flot.pie.min.js"></script>
<script src="js/plugins/charts/jquery.flot.stack.min.js"></script>
<script src="js/plugins/charts/jquery.flot.symbol.min.js"></script>
<!--[if lt IE 9]>      
          <script type="text/javascript" src="js/plugins/charts/excanvas.min.js"></script>
    <![endif]-->
<script src="js/plugins/tables/jquery.dataTables.min.js"></script>
<script src="js/plugins/calendar/fullcalendar.min.js"></script>
<script src="js/plugins/formselements/chosen.jquery.min.js"></script>
<script src="js/plugins/formselements/scrollability.min.js"></script>
<script src="js/plugins/formselements/jquery.dropkick-1.0.0.js"></script>

<script src="js/script.js"></script>
<script src="js/specific/sparks.js"></script>
<script src="js/specific/index.js"></script>

<script type='text/javascript' src='https://www.google.com/jsapi'></script>
<script type='text/javascript'>
	var config = $
			.getJSON(
					"http://localhost:8080/AnalyseurSite/service/AudienceGeoJSON?idSite=1",
					function(data) {
						config = data;
					});
	google.load('visualization', '1', {
		'packages' : [ 'geochart' ]
	});
	google.setOnLoadCallback(drawRegionsMap);

	function drawRegionsMap() {

		var map = new google.visualization.DataTable();
		map.addRows(config.pays.length); // length gives us the number of results in our returned data
		map.addColumn('string', 'Nom');
		map.addColumn('number', 'Pourcentage %');

		for ( var i = 0; i < config.pays.length; i++) {
			map.setValue(i, 0, config.pays[i].nom.replace("?", ""));
			map.setValue(i, 1, config.pays[i].pourcentage);
		}

		var options = {};

		var chart = new google.visualization.GeoChart(document
				.getElementById('geomapAlexa'));
		chart.draw(map, options);
	};
</script>

</head>
<body onload="ChargerMenu()">
	<div id="loader_cont">
		<img src="img/loaders/page_loader.gif">
	</div>
	<div class="navbar navbar-fixed-top">
		<div class="navbar-inner">
			<div class="container">
				<a class="btn btn-navbar" data-toggle="collapse"
					data-target=".nav-collapse"> <span
					class="sweet-gray sweet-go-back-from-screen">&nbsp;</span>
				</a>
				<div class="nav-collapse">
					<ul class="nav main_nav" role="navigation">
						<li id="mail" class="styled dropdown mail"><a
							class="dropdown-toggle" data-toggle="dropdown" href="#">Mail<span
								class="info">2</span></a>
							<ul class="dropdown-menu top_menu">
								<li><a class="mn_new_msg" href="mail.html"><span>New
											Message</span></a></li>
								<li><a class="mn_inbox" href="mail.html"><span>Inbox</span></a></li>
								<li><a class="mn_outbox" href="mail.html"><span>OutBox</span></a></li>
								<li><a class="mn_spam" href="mail.html"><span>Spam</span></a></li>
								<li><a class="mn_trash" href="mail.html"><span>Trash</span></a></li>
							</ul></li>
						<li id="chat" class="styled chat"><a data-toggle="modal"
							href="#chat_modal">Chat<span class="info">5</span></a></li>
						<li id="notification" class="styled dropdown notification"><a
							class="dropdown-toggle" data-toggle="dropdown" href="#">Notification<span
								class="info">4</span></a>
							<ul class="dropdown-menu">
								<li><a href="#"> Lorem ipsum dolor sit amet,
										consectetur adipiscing elit... <span>07/19/2012</span>
								</a></li>
								<li><a href="#"> Vivamus ut enim vitae nibh aliquet
										pre-tium lobortis sit amet tortor... <span>07/19/2012</span>
								</a></li>
								<li><a href="#"> Ut id dui arcu, non tempus nunc... <span>07/19/2012</span>
								</a></li>
								<li><a href="#"> Morbi faucibus suscipit nibh, ut
										pellen-tesque lectus pellentesque non.... <span>07/19/2012</span>
								</a></li>
								<li class="show_all"><a href="#">Show all notifications</a></li>
							</ul></li>
					</ul>
					<ul class="main_nav nav pull-right">
						<li id="search" class="search"><a href="#">Search</a>
							<div class="search_cont">
								<form class="navbar-search form-search">
									<input type="text" class="input-medium search-query"
										placeholder="Search">
									<button type="submit">Search</button>
								</form>
							</div></li>
						<li id="settings" class="styled dropdown settings"><a
							class="dropdown-toggle" data-toggle="dropdown" href="#">Settings</a>
							<ul class="dropdown-menu top_menu">
								<li class="show_all">Settings</li>
								<li><a class="mn_site" href="#"><span>Site</span></a></li>
								<li><a class="mn_admin" href="#"><span>Admin</span></a></li>
								<li><a class="mn_mail" href="#"><span>Mail</span></a></li>
								<li><a class="mn_user" href="#"><span>User</span></a></li>
							</ul></li>
						<li id="profile" class="styled dropdown profile"><a
							class="dropdown-toggle" data-toggle="dropdown" href="#">Profile</a>
							<ul class="dropdown-menu top_menu">
								<li class="profile group"><img src="img/general/user_1.jpg"
									width="50" height="50" alt="User">
									<ul>
										<li><strong>John Doe</strong></li>
										<li>@johndoe</li>
										<li><span>Administrator</span></li>
									</ul></li>
								<li><a class="mn_settings" href="#"><span>My
											Settings</span></a></li>
								<li><a class="mn_profile" href="profile.html"><span>My
											Profile</span></a></li>
								<li><a class="mn_logout" href="login.html"><span>Logout</span></a></li>
							</ul></li>
					</ul>
				</div>
				<h1 class="brand">
					<a href="index-2.html">PHOENIX</a>
				</h1>
			</div>
		</div>
	</div>

	<div class="container">
		<div class="main_content row-fluid">
			<div class="span3" id="menuAnalyseur"></div>
			<!--/span-->
			<div class="span9">
				<div class="row-fluid" id="AnalyseurContent">

					<script type="text/javascript">
						function ChargerPage(idPage) {
							var jContent = $("#AnalyseurContent");
							$.ajax({
								// The link we are accessing.
								url : "/AnalyseurSite/template/Alexa?idSite=1",

								// The type of request.
								type : "get",

								// The type of data that is getting returned.
								dataType : "html",

								error : function() {
									ShowStatus("AJAX - error()");

									// Load the content in to the page.
									jContent.html("<p>Page Not Found!!</p>");
								},

								beforeSend : function() {
									ShowStatus("AJAX - beforeSend()");
								},

								complete : function() {
									jContent.html();
								},

								success : function(strData) {
									// Load the content in to the page.
									jContent.html(strData);
									if (idPage == 1)
										drawRegionsMap();
								}
							});
							//charger le premier produit
							//TabSelectionner(${numProd});
						}
					</script>
				</div>
				<!--/row-->


			</div>
			<!--/span-->
		</div>
		<!--/row-->
		<hr>

		<footer>
			<p>&copy; M2 MIAGE - Analyseur Web 2013</p>
		</footer>

	</div>
	<!--/.fluid-container-->

	<!-- ===================== CHAT - Modal ===================== -->
	<div id="chat_modal" class="chat_modal modal fade hide">
		<div class="modal-header">
			<ul>
				<li class="toggle_users"><a href="#">Show Users</a></li>
				<li class="status"><a class="online" href="#"><span>Status</span></a>
					<ul>
						<li><a class="online" href="#" title="Online"><span>Online</span></a></li>
						<li><a class="away" href="#" title="Away"><span>Away</span></a></li>
						<li><a class="busy" href="#" title="Busy"><span>Busy</span></a></li>
						<li><a class="invisiblee" href="#" title="Invisible"><span>Invisible</span></a></li>
						<li><a class="offline" href="#" title="Offline"><span>Offline</span></a></li>
					</ul></li>
				<li class="chat_name">John Doe</li>
			</ul>
			<button type="button" class="close" data-dismiss="modal">x</button>
		</div>
		<div class="modal-body">
			<div class="msg_cont left">
				<img src="img/general/user_1.jpg" width="50" height="50" alt="User">
				<ul>
					<li>
						<h3>John Doe:</h3> <span>16 minutes ago</span>
					</li>
					<li>Aliquam iaculis volutpat ipsum ullamcorper tempus. In in
						dui tortor. Mauris sed volutpat metus. Duis ut sapien sapien, id
						pellentesque orci. Nullam nisl metus, sodales ut laoreet eget,
						pretium porttitor quam. Sed varius vulputate lacinia.</li>
				</ul>
			</div>
			<div class="msg_cont right">
				<img src="img/general/user_2.jpg" width="50" height="50" alt="User">
				<ul>
					<li>
						<h3>Jessie Doe:</h3> <span>16 minutes ago</span>
					</li>
					<li>Aliquam iaculis volutpat ipsum ullamcorper tempus. In in
						dui tortor. Mauris sed volutpat metus. Duis ut sapien sapien, id
						pellentesque orci. Nullam nisl metus, sodales ut laoreet eget,
						pretium porttitor quam. Sed varius vulputate lacinia.</li>
				</ul>
			</div>
			<div class="msg_cont left">
				<img src="img/general/user_1.jpg" width="50" height="50" alt="User">
				<ul>
					<li>
						<h3>John Doe:</h3> <span>16 minutes ago</span>
					</li>
					<li>Aliquam iaculis volutpat ipsum ullamcorper tempus. In in
						dui tortor. Mauris sed volutpat metus. Duis ut sapien sapien, id
						pellentesque orci. Nullam nisl metus, sodales ut laoreet eget,
						pretium porttitor quam. Sed varius vulputate lacinia.</li>
				</ul>
			</div>
		</div>
		<div class="modal-footer">
			<textarea></textarea>
			<a href="#" class="btn btn-inverse">Send</a>
		</div>
	</div>
	<script type="text/javascript">
		var idPage = 0;
		var jContent = $("#AnalyseurContent");

		// Hook up link click events to load content.
		$(".optionTab").click(function(objEvent) {

			var jLink = $(this);

			// Clear status list.
			$("#ajax-status").empty();

			// Launch AJAX request.
			$.ajax({
				// The link we are accessing.
				url : jLink.attr("href"),

				// The type of request.
				type : "get",

				// The type of data that is getting returned.
				dataType : "html",

				error : function() {
					ShowStatus("AJAX - error()");

					// Load the content in to the page.
					jContent.html("<p>Page Not Found!!</p>");
				},

				beforeSend : function() {
					ShowStatus("AJAX - beforeSend()");
				},

				complete : function() {
					jContent.html();
				},

				success : function(strData) {
					// Load the content in to the page.
					jContent.html(strData);

					if (idPage == 2)
						drawRegionsMap();
				}
			});

			// Prevent default click.
			return (false);
		});

		function TabSelectionner(num) {
			idPage = num;
			if (num == null)
				num = 1;
			var jTabCurrent = $("#anal_web" + num);
			//var jTitre = $("#titre");
			var jTabs = $(".anal_web");
			jTabs.removeClass("active");
			// Onglet courant. 
			jTabCurrent.addClass("active");
			//jTitre.html($("#titre" + num).html());
		}
	</script>
	<script type="text/javascript">
		// I show the status on the screen.
		function ShowStatus(strStatus) {
			var jStatusList = $("#AnalyseurContent");
			jStatusList.html("");
			// Prepend the paragraph.
			var contentHtml = "<ul class=\"breadcrumb br_styled no_space\"><li class=\"active\">Chargement</li></ul>"
					+ "<ul class=\"page_info\"><li><img src=\"${pageContext.request.contextPath}/template/img/loaders/page_loader.gif\"/>"
					+ "</li></ul>";
			jStatusList.prepend(contentHtml);
		}
	</script>
</body>
</html>